<template>
	<cxView>
		<!-- v-if="orderStatus!=statusEnums.reserveStatusFinished&&orderStatus!=statusEnums.Finished&&model.isEvaluate!='N'" -->
		<!-- 用户订单状态 -->
		<cxView display="flex" marginRight="20" flexDirection="row-reverse" marginTop="20" size="24" flex-wrap="wrap">

			<cxView padding="10rpx 20rpx" borderRadius="40" border="2rpx solid #f70" color="#f70" marginLeft="20">
				<!-- 支付跑腿费 -->
				<view @tap.stop="buttonClick(10)">去支付</view>
			</cxView>

			<!-- 服务中 -->
			<cxView padding="10rpx 20rpx" borderRadius="40" border="2rpx solid #f70" color="#f70" marginLeft="20">
				<view @tap.stop="buttonClick(5)">服务完成</view>
			</cxView>
			<cxView padding="10rpx 20rpx" borderRadius="40" :border="borderBlue" :color="$cx.color.cxBlueColor"
				marginLeft="20">
				<view @tap.stop="buttonClick(7)">申请优惠</view>
				<!-- v-if="orderStatus==statusEnums.InService" -->
			</cxView>
			<cxView padding="10rpx 20rpx" borderRadius="40" border="2rpx solid #f70" color="#f70" marginLeft="20">
				<!-- 支付救援费用 -->
				<view @tap.stop="buttonClick(11)">支付费用</view>
			</cxView>

			<!-- 待评价 -->
			<cxView padding="10rpx 20rpx" borderRadius="40" border="2rpx solid #f70" color="#f70" marginLeft="20"
				v-if="orderStatus==statusEnums.Finished&&cellModel.isEvaluate==='N'">
				<view @tap.stop="buttonClick(8)">去评价</view>
			</cxView>

			<cxView padding="10rpx 20rpx" borderRadius="40" border="2rpx solid #f70" color="#f70" marginLeft="20">
				<view @tap.stop="buttonClick(15)">追加评价</view>
			</cxView>


			<!-- isEvaluate -->
			<!-- 预约订单 -->
			<!-- 未支付 -->
			<cxView padding="10rpx 20rpx" borderRadius="40" border="2rpx solid #f70" color="#f70" marginLeft="20">
				<!-- 支付预约费用 -->
				<view @tap.stop="buttonClick(12)">支付费用</view>
			</cxView>

			<cxView padding="10rpx 20rpx" borderRadius="40" border="2rpx solid #f70" color="#f70" marginLeft="20">
				<!-- 申请优惠-，预约订单未支付时，可以申请优惠 -->
				<view @tap.stop="buttonClick(7)">申请优惠</view>
			</cxView>
			<!-- 待上门 -->


			<!-- 预约订单，服务中 -->
			<cxView padding="10rpx 20rpx" borderRadius="40" border="2rpx solid #f70" color="#f70" marginLeft="20">
				<view @tap.stop="buttonClick(5)">服务完成</view>
			</cxView>


			<!-- 退款售后 ,已完成-->
			<cxView padding="10rpx 20rpx" borderRadius="40" border="2rpx solid #333" color="#333" marginLeft="20">
				<view @tap.stop="buttonClick(1)">删除订单</view>
			</cxView>


			<cxView padding="10rpx 20rpx" borderRadius="40" :border="borderBlue" :color="$cx.color.cxBlueColor"
				marginLeft="20">
				<view @tap.stop="buttonClick(0)">取消订单</view>
			</cxView>

		</cxView>


		<u-popup v-model="popupShow" mode="center" width="80%" border-radius="20">
			<modelAlert @confirm="(param)=>confirmFavorable(param,alertIndex)" @cancel="popupShow=false" title="请输入金额"
				:title="alertTitle"></modelAlert>

		</u-popup>


		<u-select v-model="payTypeShow" :list="payTypeList" @confirm="(param)=>payTypeConfirm(param,alertIndex)"
			confirm-color="#f70" @cancel="cancelPayClick" :mask-close-able="false"></u-select>



	</cxView>
</template>

<script>
	export default {
		name: "orderStatusBtn",
		data() {
			return {
				popupShow: false,
				borderBlue: '2rpx solid ' + this.$cx.color.cxBlueColor,
				orderStatus: 0,


				alertIndex: 0, //用于处理不同的弹窗，此数据来源按钮的index
				alertTitle: '提醒',
				// 支付方式选择
				payTypeList: [{
						value: '0',
						label: '钱包'
					},
					{
						value: '1',
						label: '微信'
					},
					{
						value: '2',
						label: '支付宝'
					}
				],
				payTypeShow: false,
				currentItem: {},
				cellModel: {}

			};
		},
		props: {
			/**
			 * 订单状态
			 */
			status: {
				type: [String, Number],
				default: 0
			},
			/**
			 * 角色
			 */
			role: {
				type: [String, Number],
				default: 0
			},
			/**
			 * 数据model
			 */
			model: {
				type: Object,
				defautl() {
					return {}
				}
			},
			/**
			 * 订单类型，0，救援订单，1，预约订单
			 */
			orderType: {
				type: [Number, String],
				defautl: 0
			},
			/**
			 * 从列表进入
			 */
			fromList: {
				type: Boolean,
				default: false
			},
			/**
			 * 优惠信息
			 */
			favorableInfo: {
				type: Object,
				defautl() {
					return {}
				}
			}
		},
		watch: {
			status: {
				handler(newObj) {
					this.orderStatus = newObj
				},
				immediate: true
			},
			model: {
				handler(newObj) {
					this.cellModel = newObj
				},
				immediate: true,
				deep: true
			}
		},
		methods: {
			async buttonClick(index) {
				// this.$emit("buttonClick", index)


				this.currentItem = this.cellModel;
				let item = this.currentItem
				this.alertIndex = index;
				// console.log(this.currentItem);
				switch (index) {
					case 0: {
						// 取消订单
						this.cancelClick(this.cellModel)
					}
					break;
					case 1: {
						// 删除订单
						this.deleClick(item);
					}
					break;
					case 2: {
						// 去接单

					}
					break;
					case 3: {
						// 3救援出单
						let status = "30"

						this.updateStatus(item, status, "出单成功")
						this.$socketSend()

					}
					break;
					case 4: {
						// 4扫码验证


					}
					break;
					case 5: {
						// 5服务完成


					}
					break;
					case 6: {
						// 6维修报价


					}
					break;
					case 7: {
						// 7申请优惠


					}
					break;
					case 8: {
						// 去评价


					}
					break;
					case 9: {
						// 配件清单

					}
					break;
					case 10: {
						// 支付跑腿费
						// this.payTypeShow = true;



					}
					break;
					case 11: {
						// 支付救援费用
						// this.payTypeShow = true;


					}
					break;
					case 12: {
						// 支付预约费用
						// this.payTypeShow = true;

						uni.$u.route({
							url: "/pages/me/pay/pay",
							params: {
								reserveOrderId: this.currentItem.reserveOrderId,
								paySource: 2,
								amount: this.currentItem.payAmount,
								orderType: this.orderType
							}
						})
					}
					break;
					case 13: {
						// 维修记录

						uni.$u.route({
							url: "/pages/me/pay/pay",
							params: {
								reserveOrderId: this.currentItem.reserveOrderId,
								paySource: 2,
								amount: this.currentItem.serviceAmount
							}
						})
					}
					break;
					case 14: {
						// 优惠信息审核



					}
					break;
					case 15: {
						// 追加评价
						let orderId = ""


						uni.$u.route({
							url: "/pages/me/evaluate/addFollowEvaluate",
							params: {
								orderId: orderId,
								orderType: this.orderType,
								model: JSON.stringify(this.cellModel)
							}
						})
					}
					break;
					case 16: {
						// 上传图片
						let orderId = ""


						uni.$u.route({
							url: "/pages/me/order/addRepairImg",
							params: {
								orderId: orderId,
								orderType: this.orderType,
								model: JSON.stringify(this.cellModel)
							}
						})
					}
					break;
					default:
						break;
				}

			},

			// 取消订单
			cancelClick(item) {
				let that = this;
				uni.showModal({
					title: '提示',
					content: '是否确认取消订单？',
					confirmText: "确认取消订单",

					cancelText: "取消",


				});


			},

			// 修改订单状态
			async updateStatus(item, status, alertName) {

				// this.$log("-----------3----", item)


			},

			// 删除订单
			deleClick(item) {
				let that = this;
				uni.showModal({
					title: '提示',
					content: '确认删除订单？',
					success: function(res) {
						if (res.confirm) {
							that.delOrder(item);

						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},

			payTypeConfirm(e, index) {




			},
			// 取消支付
			cancelPayClick() {

			},


		}
	}
</script>

<style>

</style>